<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>盒子模型</title>
		<style>
			/* 盒子模型4个元素: */
			/* content:内容
			padding:内边距
			border:边框
			margin:外边框 
			边框颜色：1.颜色单词2.#6位十六进制,rgb(三个值，每个值小于255)*/
			.box{
				width: 200px;
				height: 300px;
				border:1px rgb(255, 2, 8);/*符合写法 */
				/* soild:实线
				dotted:点线
				dashed: 虚线*/
				border-bottom: 10px dotted red;
				border-top: 10px solid green;
				border-left: 5px solid pink;
				border-right: 5px dashed aquamarine;
				/* 方位词: top上,bottom下,left左,right右,center中间 */
				padding-top: 50px;
				padding-left: 40px;
				padding-right: 100px;
				/* 符合写法 */
				padding :10px;/* 四个方位的内边距都是10 */
				padding: 10px 20px;/* 第一个值指上 */
				padding:10px 20px 30px 40px
			}
		</style>
	</head>
	<body>
		<div class="box">hello box</div>
	</body>
</html>
